<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		#check{
			width: 15px;
			height: 15px;
		}
	</style>
	<body>
		<span>用户名：</span>
		<input id="uname" />
		<span>密码</span>
		<input type="password" id="psw" />
		<br>
		<br>
		<input type="checkbox" id="check" />
		<span>存储用户名、密码到本地</span>
	</body>
	<script>
		var uname = document.querySelector("#uname");
		var psw = document.querySelector("#psw");
		var check = document.querySelector("#check");
		
		uname.addEventListener("change",()=>{
			if(!localStorage.getItem(uname.value)){
				check.checked = false;
			}
		})
		check.addEventListener("change",()=>{
			if(check.checked){
				//选中，记住账号名和密码
				localStorage.setItem(uname.value, psw.value);
				console.log(localStorage.getItem(uname.value));
			}
		})
	</script>
</html>
